<template>
	<div>
		<!--查询框 -->
		<div>
			<table valign="middle" class="table table-bordered search-table">
				<tbody>
					<tr>
						<td>我的名字很长</td>
						<td><input class="form-control" type="text"></td>
						<td>名称1</td>
						<td>
							<select class="form-control">
								<option>test</option>
								<option>test</option>
							</select>
						</td>
						<td>名称1</td>
						<td><input class="form-control" type="text"></td>
					</tr>
					<tr>
						<td>名称1</td>
						<td><input class="form-control" type="text"></td>
						<td>名称1</td>
						<td><input class="form-control" type="text"></td>
						<td>名称1</td>
						<td><input class="form-control" type="text"></td>
					</tr>
					<tr>
						<td class="td-btn" colspan="6">
							<button class="btn btn-default">重置</button>
							<button class="btn btn-default">保存</button>
						</td>
					</tr>
				</tbody>
			</table>
		</div>
		<!--主表按钮-->
		<div class="main-btn">
			<button data-toggle="modal" data-backdrop="static" data-target="#add" @click="add_btn()" class="btn btn-default select-all">新建</button>
		</div>
		<!--主表信息-->
		<div class="table-srcoll">
			<table class="table table-bordered">
				<tbody>
					<tr class="th-bg">
						<th><input type="checkbox"></th>
						<th>序号</th>
						<th>仓库编码</th>
						<th>仓库名称</th>
						<th>建账完毕</th>
						<th>数据域</th>
						<th>操作</th>
					</tr>
					<tr v-for="data in tablelist">
						<td class="td-checkbox"><input type="checkbox"></td>
						<td class="td-index">1</td>
						<td>{{data.goodsName}}</td>
						<td>{{data.goodsId}}</td>
						<td>{{data.skuValue}}</td>
						<td>{{data.createTime}}</td>
						<td class="td-handle">
							<i data-toggle="modal" data-backdrop="static" data-target="#add" @click="search_btn()" class="glyphicon glyphicon-search cur"></i>
							<i data-toggle="modal" data-backdrop="static" data-target="#add" @click="edit_btn()" class="glyphicon glyphicon-pencil cur"></i>
							<i @click="del_btn()" class="glyphicon glyphicon-trash cur"></i>
						</td>
					</tr>
				</tbody>
				<tfoot>
					<tr>
						<td colspan="100">
							<boot-page ref="page" :async="true" :url="url" :lens="lenArr" :page-len="pageLen" :param="param"></boot-page>
						</td>
					</tr>
				</tfoot>
			</table>
		</div>
		<!--编辑，查询弹框 -->
		<div class="modal fade" id="add" tabindex="-1" role="dialog" aria-labelledby="#modal-header" aria-hidden="true">
			<div class="modal-dialog  ">
				<div class="modal-content">
					<div class="modal-header">
						<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
						<h4 class="modal-title" id="myModalLabel">{{dis[0]}}</h4>
					</div>
					<div class="modal-body">
						<table valign="middle" class="table table-bordered search-table">
							<tbody>
								<tr>
									<td>报表类型</td>
									<td>
										<select class="form-control" v-bind:disabled="dis[1]">
											<option>销售日报</option>
											<option>销售月报</option>
										</select>
									</td>
									<td>名称1</td>
									<td>
										<select class="form-control" v-bind:disabled="dis[2]">
											<option>test</option>
											<option>test</option>
										</select>
									</td>
									<td>名称3</td>
									<td><input v-bind:disabled="dis[3]" class="form-control" type="text"></td>
								</tr>
								<tr>
									<td>名称4</td>
									<td><input class="form-control" v-bind:disabled="dis[4]" type="text"></td>
									<td>名称5</td>
									<td><input class="form-control" v-bind:disabled="dis[5]" type="text"></td>
									<td>名称6</td>
									<td><input class="form-control" v-bind:disabled="dis[6]" type="text"></td>
								</tr>
							</tbody>
						</table>
					</div>
					<div class="modal-footer">
						<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
						<button type="button" class="btn btn-primary">添加</button>
					</div>
				</div>
			</div>
		</div>

	</div>

</template>

<script type="text/ecmascript-6">
	import Common from '../../../../static/js/common.js'
	import bootPage from '@/components/main/pagination/BootPage.vue'
	export default {
		name: 'unit_manage',
		data() {
			return {
				url: 'GoodsAdmin/queryListForPageGoods',
				lenArr: [5, 10, 30],
				pageLen: 500, // 可显示的分页数,
				param: {},
				dis: [],
				edit: ['编辑', '', false, '', false, '', false],
				search: ['查询', '', '', '', '', '', ''],
				add:['新建',false, '', '', '', '', '']
			};

		},
		components: {
			bootPage
		},
		computed: {
			tablelist() {
				return this.$store.state.pageData;
			}
		},
		activated() {

		},

		methods: {
			del_btn: function() {
				Common.myAlert('添加成功', 'success');
				$(".loading").fadeIn(500);
				//$(".loading").fadeOut(500);
			},
			edit_btn: function() {
				this.dis=this.edit
			},
			search_btn: function() {
				this.dis=this.search
			},
			add_btn: function() {
				this.dis=this.add
			},
			refresh () {
   				this.$refs.page.refresh2() // 这里提供了一个表格刷新功能
   			}

		}
	}
</script>